@extends('Layouts.iframe')
@section('content')
    <nav class="breadcrumb"><i class="Hui-iconfont">&#xe67f;</i> 首页 <span class="c-gray en">&gt;</span> 管理员管理 <span class="c-gray en">&gt;</span> 管理员列表
        {{--<a class="btn btn-success radius r" style="line-height:1.6em;margin-top:3px" href="javascript:location.replace(location.href);" title="刷新" ><i class="Hui-iconfont">&#xe68f;</i></a>--}}
        <a class="btn btn-success radius r" style="line-height:1.6em;margin-top:3px" href="{{ url('admin/adminuser') }}" title="重置" ><i class="Hui-iconfont">&#xe68f;</i></a>
    </nav>
       <div class="page-container">
           @can('adminuser.search')
               <form action="" method="get" id="product-search">
                   <input type="hidden" name="_token" value="{{csrf_token()}}">
                    <div class="text-c"> 日期范围：
                        <input type="text" onfocus="WdatePicker({ maxDate:'#F{$dp.$D(\'datemax\')||\'%y-%M-%d\'}' })" id="datemin" class="input-text Wdate" style="width:120px;" name="start">
                        -
                        <input type="text" onfocus="WdatePicker({ minDate:'#F{$dp.$D(\'datemin\')}',maxDate:'%y-%M-%d' })" id="datemax" class="input-text Wdate" style="width:120px;" name="end" >
                        <input type="text" class="input-text" style="width:250px" placeholder="输入管理员名称" id="keywords" name="keywords" >
                        <button type="submit" class="btn btn-success" id="" name="" ><i class="Hui-iconfont">&#xe665;</i> 搜索 </button>
                    </div>
               </form>
           @endcan
        <div class="cl pd-5 bg-1 bk-gray mt-20">
            <span class="l">
               {{-- <a href="javascript:;" onclick="datadel()" class="btn btn-danger radius"><i class="Hui-iconfont">&#xe6e2;</i> 批量删除</a>--}}
                @can('adminuser.create')
                <a href="javascript:;" onclick="admin_add('添加管理员','{{ url('admin/adminuser/create')  }}','800','600')" class="btn btn-primary radius"><i class="Hui-iconfont">&#xe600;</i> 添加管理员</a>
                @endcan
            </span> <span class="r">共有数据：<strong>{{ $page->total() }}</strong> 条</span> </div>
        <table class="table table-border table-bordered table-bg">
            <thead>
            <tr>
                <th scope="col" colspan="9">员工列表</th>
            </tr>
            <tr class="text-c">
                {{--<th width="25"><input type="checkbox" name="" value=""></th>--}}
                <th width="40">编号</th>
                <th width="150">登录名</th>
                <th width="90">手机</th>
                <th width="150">邮箱</th>
                <th width="250">角色</th>
                <th width="130">加入时间</th>
                <th width="100">是否已启用</th>
                @if(auth()->user()->can('adminuser.edit') or auth()->user()->can('adminuser.setStatus'))
                    <th width="150">操作</th>
                @endif
                {{--@can('adminuser.edit' | 'adminuser.setStatus')@endcan--}}
            </tr>
            </thead>
            <tbody>
            @if($page)
                @foreach($page as $item)
            <tr class="text-c">
                {{--<td><input type="checkbox" value="{{ $item->id }}" name=""></td>--}}
                <td>{{ $item->id }}</td>
                <td>{{ $item->username }}</td>
                <td>{{ $item->mobile }}</td>
                <td>{{ $item->email }}</td>
                <td>{{ $item->getRole['describe'] }}</td>
                <td>{{ $item->created_at }}</td>
                <td class="td-status">
                    @if($item->status == 1)
                    <span class="label label-success radius">已启用</span>
                @else
                    <span class="label label-warning radius">已禁用</span>
                    @endif
                </td>
                @if(auth()->user()->can('adminuser.edit') or auth()->user()->can('adminuser.setStatus') or auth()->user()->can('adminuser.destroy'))
                    <td class="td-manage">
                        @can('adminuser.setStatus')
                            @if($item->status == 1)
                            <a style="text-decoration:none" onClick='admin_stop(this,"{{$item->id}}")' href="javascript:;" title="停用" class="label label-warning radius">禁用</a>
                            @else
                            <a style="text-decoration:none" onclick="admin_start(this,'{{ $item->id }}')" href="javascript:;" title="启用" class="label label-success radius">启用</a>
                            @endif
                        @endcan

                        @can('adminuser.edit')
                        <a title="编辑" href="javascript:;" onclick="admin_edit('管理员编辑','/admin/adminuser/{{$item->id}}/edit','1','800','600')"  style="text-decoration:none" class="label label-primary  radius">
                            编辑</a>
                        @endcan
                        @can('adminuser.destroy')
                        <a title="删除" href="javascript:;" onclick="admin_del(this,'{{ $item->id }}')" class="label label-danger radius" style="text-decoration:none" >删除</a>
                        @endcan

                    </td>
                @endif
            </tr>
                @endforeach
                @endif
            </tbody>
        </table>
        <div id="pull_right">
            <div class="pull-right">
                {!! $page->render() !!}
            </div>
        </div>
    </div>
@endsection
@section('js')
    <script type="text/javascript" src="/js/lib/WdatePicker.js"></script>
    <script type="text/javascript">
        /*
         参数解释：
         title	标题
         url		请求的url
         id		需要操作的数据id
         w		弹出层宽度（缺省调默认值）
         h		弹出层高度（缺省调默认值）
         */
        /*管理员-增加*/
        function admin_add(title,url,w,h){
            layer_show(title,url,w,h);
        }
        /*管理员-删除*/
        function admin_del(obj,id){
            layer.confirm('确认要删除吗？',function(index){
                $.ajax({
                    type: 'POST',
                    url: '/admin/adminuser/'+id,
                    dataType: 'json',
                    data:{'_method':'DELETE'},
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    },
                    success: function(data){
                        if(data.code == 0) {
                            $(obj).parents("tr").remove();
                            layer.msg('已删除!', {icon: 1, time: 1000});
                        }else{
                            layer.msg(data.message, {icon: 2, time: 1000});
                        }
                    },
                    error:function(data) {
                        layer.msg('系统错误', {icon: 2, time: 1000});
                    },
                });
            });
        }

        /*管理员-编辑*/
        function admin_edit(title,url,id,w,h){
            layer_show(title,url,w,h);
        }
        /*管理员-停用*/
        function admin_stop(obj,id){
            layer.confirm('确认要停用吗？',function(index){
                //此处请求后台程序，下方是成功后的前台处理……
                $.ajax({
                    type: 'post',
                    url: "{{ url('admin/setStatus') }}",
                    data: {uid:id,action:'off'},
                    dataType: "json",
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    },
                    success: function (res) {
                        console.log(res);
                        if(res.code == 0) {
                            $(obj).parents("tr").find(".td-manage").prepend('<a onClick="admin_start(this,' + id + ')" href="javascript:;" title="启用" style="text-decoration:none" class="label label-success radius">启用</a>');
                            $(obj).parents("tr").find(".td-status").html('<span class="label label-warning radius">已禁用</span>');
                            $(obj).remove();
                            layer.msg('已停用!', {icon: 5, time: 1000});
                        }else{
                            layer.msg(res.message, {icon: 6, time: 1000});
                        }
                    }
                });

            });
        }

        /*管理员-启用*/
        function admin_start(obj,id){
            layer.confirm('确认要启用吗？',function(index){
                //此处请求后台程序，下方是成功后的前台处理……
                $.ajax({
                    type: 'post',
                    url: "{{ url('admin/setStatus') }}",
                    data: {uid:id,action:'on'},
                    dataType: "json",
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    },
                    success: function (res) {
                        console.log(res);
                        if(res.code == 0) {
                            $(obj).parents("tr").find(".td-manage").prepend('<a onClick="admin_stop(this,' + id + ')" href="javascript:;" title="停用" style="text-decoration:none" class="label label-warning radius">禁用</a>');
                            $(obj).parents("tr").find(".td-status").html('<span class="label label-success radius">已启用</span>');
                            $(obj).remove();
                            layer.msg('已启用!', {icon: 6, time: 1000});
                        }else{
                            layer.msg(res.message, {icon: 6, time: 1000});
                        }
                    }
                })
            });
        }
       /* function admin_search()
        {
            var start = $("#datemin").val();
            var end = $("#datemax").val();
            var keywords = $("#keywords").val();
            alert(keywords);
        }*/
    </script>
@endsection